Day12 - 2723. Add Two Promises 新增兩個Promise EASY

Description❓

Given two promises promise1 and promise2, return a new promise.
promise1 and promise2 will both resolve with a number. The returned promise should resolve with the sum of the two numbers.

接受兩個Promise (Promise1 和 Promise2)作為參數，返回一個新的 Promise。
Promise1 和 Promise2 都會解析出一個數字。 返回的Promise解析應為兩個數字的總和

Points

• 30Days of JS 工具書－Promise
• 30Days of JS 工具書－Promise.all() 返回包含全數結果的Promise
• 30Days of JS 工具書－async/await

Solution✍️

[ ▶️挑戰這一題 ][ 本日代碼 ]

• 解決方案1: 等兩個promise解析完畢後用promise.all()取得陣列，再用reduce把結果進行加總。

  const addTwoPromises = async(promise1,promise2)=>{    
     let resultAry = await Promise.all([promise1, promise2]);    
     let sum = resultAry.reduce((acc,cur)=>acc+cur,0);
     return sum;
  }
  

• 解決方案2: 利用解構賦值讓程式碼更加直觀

  const addTwoPromises = async(promise1,promise2)=>{    
     const [value1, value2] = await Promise.all([promise1, promise2]);
     return value1 + value2;
  }
  

• async\await

  • async 關鍵字用於定義一個異步函數
    範例中使用 async 的意思是告訴 JavaScript 解析器，這表示這個函數內部可能包含Promise異步操作，並且它會返回一個 Promise。
  • await 關鍵字用於等待一個 Promise 解決。
    await 關鍵字讓 JavaScript 執行緒停止執行，直到等待 Promise.all([promise1, promise2])都完成後，然後將它們的結果收集到一個陣列中。這些結果被解構賦值給 value1 和 value2 變數。

Testcase

 const test1Promise1 = new Promise(resolve => setTimeout(() => resolve(2), 20));
 const test1Promise2 = new Promise(resolve => setTimeout(() => resolve(5), 60));
 addTwoPromises(test1Promise1, test1Promise2) //PromiseResult:7

 const test2Promise1 = new Promise(resolve => setTimeout(() => resolve(10), 50));
 const test2Promise2 = new Promise(resolve => setTimeout(() => resolve(-12), 30));
 addTwoPromises(test2Promise1, test2Promise2) //PromiseResult:-2